import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'controller.dart';

class ServerK8sPage extends GetView<ServerK8sController> {
  const ServerK8sPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: IconButton(
          icon: const Icon(Icons.arrow_back_ios),
          onPressed: () {
            Get.back();
          },
        ),
        title: Obx(() => Text(controller.server.value?.name ?? 'Kubernetes 管理')),
        actions: [
          // 自动刷新开关
          Obx(() => IconButton(
            icon: Icon(
              controller.autoRefresh.value ? Icons.refresh : Icons.refresh_outlined,
              color: controller.autoRefresh.value ? Colors.green : null,
            ),
            onPressed: () => controller.toggleAutoRefresh(!controller.autoRefresh.value),
            tooltip: controller.autoRefresh.value ? '关闭自动刷新' : '开启自动刷新',
          )),
          // 设置菜单
          PopupMenuButton<String>(
            icon: const Icon(Icons.more_vert),
            tooltip: '更多选项',
            itemBuilder: (context) => [
              PopupMenuItem(
                value: 'refresh_interval',
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Text('刷新间隔', style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold)),
                    const SizedBox(height: 4),
                    Obx(() => Wrap(
                      spacing: 4,
                      children: [3, 5, 10, 30].map((seconds) {
                        final isSelected = controller.refreshInterval.value == seconds;
                        return ChoiceChip(
                          label: Text('${seconds}s', style: const TextStyle(fontSize: 10)),
                          selected: isSelected,
                          onSelected: (_) => controller.setRefreshInterval(seconds),
                          padding: const EdgeInsets.symmetric(horizontal: 4, vertical: 0),
                          materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
                        );
                      }).toList(),
                    )),
                  ],
                ),
              ),
              PopupMenuItem(
                value: 'group',
                child: Obx(() => CheckboxListTile(
                  title: const Text('按命名空间分组', style: TextStyle(fontSize: 12)),
                  value: controller.groupByNamespace.value,
                  onChanged: (value) => controller.toggleGroupByNamespace(value ?? true),
                  dense: true,
                  contentPadding: EdgeInsets.zero,
                )),
              ),
            ],
          ),
        ],
      ),
      body: Obx(() {
        // 未连接状态
        if (!controller.isConnected) {
          return _buildNotConnectedView();
        }

        // 检查 kubectl
        if (!controller.hasKubectl.value) {
          return _buildNoKubectlView();
        }

        // 加载中
        if (controller.isLoading.value && controller.pods.isEmpty) {
          return const Center(child: CircularProgressIndicator());
        }

        return RefreshIndicator(
          onRefresh: controller.refreshData,
          child: Column(
            children: [
              // 命名空间选择器
              _buildNamespaceSelector(),
              const Divider(height: 1),
              // Pod 列表
              Expanded(child: _buildPodList()),
            ],
          ),
        );
      }),
    );
  }

  /// 构建未连接视图
  Widget _buildNotConnectedView() {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Icon(Icons.cloud_off, size: 48, color: Colors.grey.shade400),
          const SizedBox(height: 12),
          Text(
            '未连接到服务器',
            style: TextStyle(
              fontSize: 14,
              color: Colors.grey.shade600,
              fontWeight: FontWeight.w500,
            ),
          ),
          const SizedBox(height: 6),
          Text(
            '请先连接服务器',
            style: TextStyle(fontSize: 12, color: Colors.grey.shade500),
          ),
        ],
      ),
    );
  }

  /// 构建未安装 kubectl 视图
  Widget _buildNoKubectlView() {
    return Obx(() {
      // 如果正在安装，显示安装进度
      if (controller.isInstalling.value) {
        return _buildInstallProgressView();
      }
      
      // 未安装界面
      return Center(
        child: Padding(
          padding: const EdgeInsets.all(24),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Icon(Icons.warning_amber_rounded, size: 48, color: Colors.orange.shade400),
              const SizedBox(height: 12),
              const Text(
                '未检测到 kubectl',
                style: TextStyle(
                  fontSize: 14,
                  color: Colors.grey,
                  fontWeight: FontWeight.w500,
                ),
              ),
              const SizedBox(height: 8),
              Text(
                '请在服务器上安装 kubectl 工具',
                style: const TextStyle(fontSize: 12, color: Colors.grey),
                textAlign: TextAlign.center,
              ),
              const SizedBox(height: 24),
              // 一键安装按钮
              ElevatedButton.icon(
                icon: const Icon(Icons.download, size: 18),
                label: const Text('一键安装 kubectl', style: TextStyle(fontSize: 13)),
                onPressed: () => _showInstallDialog(),
                style: ElevatedButton.styleFrom(
                  backgroundColor: Colors.blue,
                  foregroundColor: Colors.white,
                  padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
                  minimumSize: const Size(200, 44),
                ),
              ),
              const SizedBox(height: 12),
              // 重新检测按钮
              OutlinedButton.icon(
                icon: const Icon(Icons.refresh, size: 16),
                label: const Text('重新检测', style: TextStyle(fontSize: 12)),
                onPressed: () => controller.refreshData(),
                style: OutlinedButton.styleFrom(
                  padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
                ),
              ),
            ],
          ),
        ),
      );
    });
  }

  /// 显示安装确认对话框
  void _showInstallDialog() {
    Get.dialog(
      AlertDialog(
        title: const Row(
          children: [
            Icon(Icons.rocket_launch, color: Colors.blue, size: 24),
            SizedBox(width: 8),
            Text('一键安装 kubectl', style: TextStyle(fontSize: 15)),
          ],
        ),
        content: Column(
          mainAxisSize: MainAxisSize.min,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Container(
              padding: const EdgeInsets.all(12),
              decoration: BoxDecoration(
                color: Colors.green.shade50,
                borderRadius: BorderRadius.circular(8),
                border: Border.all(color: Colors.green.shade200),
              ),
              child: Row(
                children: [
                  Icon(Icons.speed, color: Colors.green.shade700, size: 20),
                  const SizedBox(width: 8),
                  const Expanded(
                    child: Text(
                      '使用阿里云镜像，下载速度超快！',
                      style: TextStyle(fontSize: 11, fontWeight: FontWeight.bold),
                    ),
                  ),
                ],
              ),
            ),
            const SizedBox(height: 16),
            const Text(
              '安装方式：',
              style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 8),
            const Text('• 自动检测系统类型', style: TextStyle(fontSize: 11)),
            const Text('• 使用国内镜像加速（阿里云）', style: TextStyle(fontSize: 11)),
            const Text('• 自动完成安装和验证', style: TextStyle(fontSize: 11)),
            const Text('• 预计耗时 10-30 秒', style: TextStyle(fontSize: 11)),
            const SizedBox(height: 12),
            Container(
              padding: const EdgeInsets.all(8),
              decoration: BoxDecoration(
                color: Colors.orange.shade50,
                borderRadius: BorderRadius.circular(6),
              ),
              child: Row(
                children: [
                  Icon(Icons.info_outline, size: 16, color: Colors.orange.shade700),
                  const SizedBox(width: 6),
                  const Expanded(
                    child: Text(
                      '需要 root 或 sudo 权限',
                      style: TextStyle(fontSize: 10, color: Colors.black87),
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
        actions: [
          TextButton(
            onPressed: () => Get.back(),
            child: const Text('取消'),
          ),
          ElevatedButton.icon(
            icon: const Icon(Icons.download, size: 18),
            label: const Text('立即安装'),
            onPressed: () {
              Get.back();
              controller.installKubectl(useChinaMirror: true);
            },
            style: ElevatedButton.styleFrom(
              backgroundColor: Colors.blue,
              foregroundColor: Colors.white,
              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10),
            ),
          ),
        ],
      ),
    );
  }

  /// 构建安装进度视图
  Widget _buildInstallProgressView() {
    return Padding(
      padding: const EdgeInsets.all(16),
      child: Column(
        children: [
          // 标题
          Row(
            children: [
              Icon(Icons.downloading, color: Colors.blue.shade700, size: 24),
              const SizedBox(width: 12),
              const Text(
                '正在安装 kubectl',
                style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
              ),
            ],
          ),
          const SizedBox(height: 20),
          
          // 进度条
          Obx(() => Column(
            children: [
              LinearProgressIndicator(
                value: controller.installProgress.value,
                backgroundColor: Colors.grey.shade200,
                valueColor: AlwaysStoppedAnimation<Color>(Colors.blue.shade700),
                minHeight: 8,
              ),
              const SizedBox(height: 8),
              Text(
                '${(controller.installProgress.value * 100).toInt()}%',
                style: TextStyle(fontSize: 12, color: Colors.grey.shade600),
              ),
            ],
          )),
          
          const SizedBox(height: 20),
          
          // 安装日志
          Expanded(
            child: Container(
              decoration: BoxDecoration(
                color: Colors.black87,
                borderRadius: BorderRadius.circular(8),
                border: Border.all(color: Colors.grey.shade700),
              ),
              child: Obx(() => SingleChildScrollView(
                padding: const EdgeInsets.all(12),
                reverse: true, // 自动滚动到底部
                child: SelectableText(
                  controller.installLog.value.isEmpty 
                      ? '等待输出...' 
                      : controller.installLog.value,
                  style: const TextStyle(
                    fontSize: 11,
                    fontFamily: 'monospace',
                    color: Colors.greenAccent,
                    height: 1.4,
                  ),
                ),
              )),
            ),
          ),
          
          const SizedBox(height: 16),
          
          // 提示和取消按钮
          Row(
            children: [
              Expanded(
                child: Container(
                  padding: const EdgeInsets.all(12),
                  decoration: BoxDecoration(
                    color: Colors.blue.shade50,
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: Row(
                    children: [
                      Icon(Icons.info_outline, size: 16, color: Colors.blue.shade700),
                      const SizedBox(width: 8),
                      const Expanded(
                        child: Text(
                          '使用国内镜像，预计 10-30 秒完成',
                          style: TextStyle(fontSize: 11, color: Colors.black87),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
              const SizedBox(width: 8),
              ElevatedButton.icon(
                icon: const Icon(Icons.close, size: 16),
                label: const Text('取消', style: TextStyle(fontSize: 12)),
                onPressed: () => controller.cancelInstall(),
                style: ElevatedButton.styleFrom(
                  backgroundColor: Colors.red,
                  foregroundColor: Colors.white,
                  padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }

  /// 构建命名空间选择器
  Widget _buildNamespaceSelector() {
    return Container(
      color: Colors.grey.shade100,
      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
      child: Row(
        children: [
          const Text('命名空间:', style: TextStyle(fontSize: 12, fontWeight: FontWeight.w500)),
          const SizedBox(width: 8),
          Expanded(
            child: Obx(() => SingleChildScrollView(
              scrollDirection: Axis.horizontal,
              child: Row(
                children: [
                  // 所有命名空间选项
                  ChoiceChip(
                    label: const Text('所有', style: TextStyle(fontSize: 11)),
                    selected: controller.showAllNamespaces.value,
                    onSelected: (selected) => controller.toggleShowAllNamespaces(selected),
                    padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 0),
                    materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
                  ),
                  const SizedBox(width: 6),
                  // 命名空间选项
                  ...controller.namespaces.map((ns) {
                    final isSelected = !controller.showAllNamespaces.value && 
                                      controller.selectedNamespace.value == ns.name;
                    return Padding(
                      padding: const EdgeInsets.only(right: 6),
                      child: ChoiceChip(
                        label: Text(ns.name, style: const TextStyle(fontSize: 11)),
                        selected: isSelected,
                        onSelected: (_) => controller.changeNamespace(ns.name),
                        padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 0),
                        materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
                      ),
                    );
                  }).toList(),
                ],
              ),
            )),
          ),
        ],
      ),
    );
  }

  /// 构建 Pod 列表
  Widget _buildPodList() {
    return Obx(() {
      if (controller.pods.isEmpty) {
        return _buildEmptyView();
      }

      // 按命名空间分组
      if (controller.groupByNamespace.value) {
        return _buildGroupedPodList();
      }

      // 普通列表
      return _buildSimplePodList();
    });
  }

  /// 构建空视图
  Widget _buildEmptyView() {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Icon(Icons.inbox_outlined, size: 48, color: Colors.grey.shade400),
          const SizedBox(height: 12),
          Text(
            '暂无 Pod',
            style: const TextStyle(fontSize: 14, color: Colors.grey),
          ),
          if (controller.errorMessage.value.isNotEmpty) ...[
            const SizedBox(height: 8),
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 24),
              child: Text(
                controller.errorMessage.value,
                style: const TextStyle(fontSize: 11, color: Colors.red),
                textAlign: TextAlign.center,
              ),
            ),
          ],
        ],
      ),
    );
  }

  /// 构建分组 Pod 列表
  Widget _buildGroupedPodList() {
    // 按命名空间分组
    final groupedPods = <String, List<K8sPod>>{};
    for (final pod in controller.pods) {
      groupedPods.putIfAbsent(pod.namespace, () => []).add(pod);
    }

    return ListView.builder(
      padding: const EdgeInsets.all(12),
      itemCount: groupedPods.length,
      itemBuilder: (context, index) {
        final namespace = groupedPods.keys.elementAt(index);
        final pods = groupedPods[namespace]!;
        return _buildNamespaceGroup(namespace, pods);
      },
    );
  }

  /// 构建命名空间分组
  Widget _buildNamespaceGroup(String namespace, List<K8sPod> pods) {
    return Obx(() {
      final isExpanded = controller.isNamespaceExpanded(namespace);
      
      return Card(
        margin: const EdgeInsets.only(bottom: 12),
        elevation: 2,
        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
        child: Column(
          children: [
            // 分组头部
            InkWell(
              onTap: () => controller.toggleNamespaceExpanded(namespace),
              borderRadius: const BorderRadius.only(
                topLeft: Radius.circular(12),
                topRight: Radius.circular(12),
              ),
              child: Container(
                padding: const EdgeInsets.all(12),
                decoration: BoxDecoration(
                  color: Colors.purple.shade50,
                  borderRadius: BorderRadius.only(
                    topLeft: const Radius.circular(12),
                    topRight: const Radius.circular(12),
                    bottomLeft: isExpanded ? Radius.zero : const Radius.circular(12),
                    bottomRight: isExpanded ? Radius.zero : const Radius.circular(12),
                  ),
                ),
                child: Row(
                  children: [
                    Icon(
                      isExpanded ? Icons.keyboard_arrow_down : Icons.keyboard_arrow_right,
                      size: 20,
                      color: Colors.purple.shade700,
                    ),
                    const SizedBox(width: 8),
                    Icon(Icons.folder_outlined, size: 20, color: Colors.purple.shade700),
                    const SizedBox(width: 8),
                    Expanded(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            namespace,
                            style: TextStyle(
                              fontSize: 15,
                              fontWeight: FontWeight.bold,
                              color: Colors.purple.shade900,
                            ),
                          ),
                          Text(
                            '${pods.length} 个 Pod',
                            style: TextStyle(fontSize: 11, color: Colors.purple.shade600),
                          ),
                        ],
                      ),
                    ),
                    _buildPodCountBadges(pods),
                  ],
                ),
              ),
            ),
            // 分组内容
            if (isExpanded)
              ...pods.map((pod) => _buildPodItem(pod)),
          ],
        ),
      );
    });
  }

  /// 构建 Pod 数量徽章
  Widget _buildPodCountBadges(List<K8sPod> pods) {
    final runningCount = pods.where((p) => p.isRunning).length;
    final pendingCount = pods.where((p) => p.isPending).length;
    final failedCount = pods.where((p) => p.isFailed).length;
    
    return Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        if (runningCount > 0) _buildCountBadge(runningCount, Colors.green),
        if (pendingCount > 0) ...[
          const SizedBox(width: 4),
          _buildCountBadge(pendingCount, Colors.orange),
        ],
        if (failedCount > 0) ...[
          const SizedBox(width: 4),
          _buildCountBadge(failedCount, Colors.red),
        ],
      ],
    );
  }

  /// 构建数量徽章
  Widget _buildCountBadge(int count, Color color) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
      decoration: BoxDecoration(
        color: color.withAlpha(51), // 0.2 * 255 ≈ 51
        borderRadius: BorderRadius.circular(8),
      ),
      child: Text(
        '$count',
        style: TextStyle(
          fontSize: 10,
          color: color.withAlpha(230), // 深色版本
          fontWeight: FontWeight.bold,
        ),
      ),
    );
  }

  /// 构建简单 Pod 列表
  Widget _buildSimplePodList() {
    return ListView.builder(
      padding: const EdgeInsets.all(12),
      itemCount: controller.pods.length,
      itemBuilder: (context, index) {
        return _buildPodItem(controller.pods[index]);
      },
    );
  }

  /// 构建 Pod 项
  Widget _buildPodItem(K8sPod pod) {
    return Card(
      margin: const EdgeInsets.only(bottom: 8),
      elevation: 1,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
      child: InkWell(
        onTap: () => _showPodActions(pod),
        borderRadius: BorderRadius.circular(8),
        child: Padding(
          padding: const EdgeInsets.all(10),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                children: [
                  _buildStatusIndicator(pod),
                  const SizedBox(width: 8),
                  Expanded(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          pod.name,
                          style: const TextStyle(
                            fontSize: 13,
                            fontWeight: FontWeight.bold,
                          ),
                          maxLines: 1,
                          overflow: TextOverflow.ellipsis,
                        ),
                        if (!controller.groupByNamespace.value) ...[
                          const SizedBox(height: 2),
                          Text(
                            'namespace: ${pod.namespace}',
                            style: const TextStyle(fontSize: 10, color: Colors.grey),
                          ),
                        ],
                      ],
                    ),
                  ),
                  const SizedBox(width: 8),
                  _buildStatusChip(pod),
                ],
              ),
              const SizedBox(height: 8),
              Row(
                children: [
                  _buildInfoChip(Icons.restart_alt, '重启: ${pod.restarts}', Colors.blue),
                  const SizedBox(width: 6),
                  _buildInfoChip(Icons.schedule, pod.age, Colors.grey),
                  if (pod.ip.isNotEmpty) ...[
                    const SizedBox(width: 6),
                    _buildInfoChip(Icons.router, pod.ip, Colors.grey),
                  ],
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }

  /// 构建状态指示器
  Widget _buildStatusIndicator(K8sPod pod) {
    Color color;
    if (pod.isRunning) {
      color = Colors.green;
    } else if (pod.isPending) {
      color = Colors.orange;
    } else if (pod.isFailed) {
      color = Colors.red;
    } else {
      color = Colors.grey;
    }
    
    return Container(
      width: 8,
      height: 8,
      decoration: BoxDecoration(
        shape: BoxShape.circle,
        color: color,
      ),
    );
  }

  /// 构建状态徽章
  Widget _buildStatusChip(K8sPod pod) {
    Color color;
    if (pod.isRunning) {
      color = Colors.green;
    } else if (pod.isPending) {
      color = Colors.orange;
    } else if (pod.isFailed) {
      color = Colors.red;
    } else {
      color = Colors.grey;
    }
    
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
      decoration: BoxDecoration(
        color: color.withAlpha(51), // 0.2 * 255 ≈ 51
        borderRadius: BorderRadius.circular(10),
      ),
      child: Text(
        pod.status,
        style: TextStyle(
          fontSize: 10,
          color: color.withAlpha(230), // 深色版本
          fontWeight: FontWeight.w600,
        ),
      ),
    );
  }

  /// 构建信息徽章
  Widget _buildInfoChip(IconData icon, String text, Color color) {
    final darkColor = color == Colors.grey ? Colors.grey.shade700 : color.withAlpha(200);
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
      decoration: BoxDecoration(
        color: color.withAlpha(26), // 0.1 * 255 ≈ 26
        borderRadius: BorderRadius.circular(6),
      ),
      child: Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          Icon(icon, size: 12, color: darkColor),
          const SizedBox(width: 4),
          Text(
            text,
            style: TextStyle(fontSize: 10, color: darkColor),
          ),
        ],
      ),
    );
  }

  /// 显示 Pod 操作菜单
  void _showPodActions(K8sPod pod) {
    Get.bottomSheet(
      Container(
        decoration: const BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.only(
            topLeft: Radius.circular(20),
            topRight: Radius.circular(20),
          ),
        ),
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            const SizedBox(height: 12),
            Container(
              width: 40,
              height: 4,
              decoration: BoxDecoration(
                color: Colors.grey.shade300,
                borderRadius: BorderRadius.circular(2),
              ),
            ),
            const SizedBox(height: 16),
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 20),
              child: Row(
                children: [
                  _buildStatusIndicator(pod),
                  const SizedBox(width: 8),
                  Expanded(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          pod.name,
                          style: const TextStyle(
                            fontSize: 14,
                            fontWeight: FontWeight.bold,
                          ),
                          maxLines: 1,
                          overflow: TextOverflow.ellipsis,
                        ),
                        Text(
                          pod.namespace,
                          style: const TextStyle(fontSize: 11, color: Colors.grey),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
            const Divider(height: 24),
            ListTile(
              leading: const Icon(Icons.description_outlined, size: 20),
              title: const Text('查看日志', style: TextStyle(fontSize: 13)),
              onTap: () {
                Get.back();
                controller.showPodLogs(pod);
              },
              dense: true,
            ),
            ListTile(
              leading: const Icon(Icons.info_outline, size: 20),
              title: const Text('查看详情', style: TextStyle(fontSize: 13)),
              onTap: () {
                Get.back();
                controller.describePod(pod);
              },
              dense: true,
            ),
            ListTile(
              leading: const Icon(Icons.delete_outline, size: 20, color: Colors.red),
              title: const Text('删除 Pod', style: TextStyle(fontSize: 13, color: Colors.red)),
              onTap: () {
                Get.back();
                controller.deletePod(pod);
              },
              dense: true,
            ),
            const SizedBox(height: 16),
          ],
        ),
      ),
      backgroundColor: Colors.transparent,
    );
  }
}

